import { ScanOutlined } from '@ant-design/icons';
import { Divider, Space } from 'antd';
import hooks from './hooks';
import './index.less';

export default () => {
  const { loginMode, timestamp } = hooks();
  return (
    <div className="pd-login">
      <div className="pd-login-container">
        <div className="pd-login-name">知识语料库管理系统</div>
        <div className="pd-login-card">
          <div className="pd-login-iframe" id="login_container">
            {
              <iframe
                className="iframe-login"
                src={`https://zd-login.bigdatacq.com/oauth2/auth.htm?response_type=code&client_id=${loginMode.appId}&redirect_uri=${loginMode.redirectUrl}&scope=get_user_info&authType=QRCODE&embedMode=true&&timestamp=${timestamp}`}
              />
            }
          </div>
          <div className="pd-login-type">
            <Space split={<Divider type="vertical" />}>
              <div className="pd-login-type-icon">
                <ScanOutlined />
              </div>
              <div className="pd-login-type-note">
                打开
                <span style={{ marginLeft: 6 }}>渝快政 APP</span>
                <br />
                扫一扫登录
              </div>
            </Space>
          </div>
        </div>
      </div>
    </div>
  );
};
